import { Component } from "react";
class TestState extends Component{
  /**
   * + 状态`state`，即数据，是组件内部的**私有数据**，只能在组件内部使用
+ 状态 state 的值是**对象**，表示一个组件中可以有多个数据
+ 通过 `this.state.xxx` 来获取状态
   * 
   * @returns 
   */
  state={
    count:0,
    obj:{
      age:12
    },
    list:[1,2,3]
  }

  handleClick=()=>{
 console.log("组件实例",this);   
 let newObj={
  ...this.state.newObj,
  age:20
 };
 let newList=[...this.state.list,Math.random()];
this.setState({
  count:this.state.count+1,
  obj:newObj,
  list:newList
  
});
  };
  render(){
    return(
      <div>
        <h1>类组件状态</h1>
        <hr />
        
        <li>{this.state.list.join(',')}</li>
        <button  onClick={this.handleClick}>add</button>
        <li>{this.state.count}</li>
          <li>{this.state.obj.age}</li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
      </div>
    )
  }
}
export default TestState